<template>
  <div>
    <div class="component-mainHeader">
      <div class="top">
        <div class="topleft">
          <p>
            <span class="iconfont" style="color:#1abc9a;margin-right:3px;">&#xe607;</span>待收款合同
          </p>
        </div>
        <div class="topright">
          <!--<el-button type="info" @click="$router.go(-1)">
            <span style="font-weight:700;margin-right:5px;" class="iconfont">&#xe606;</span>返回
          </el-button>-->
          <el-button type="info" @click="$router.go(0)">
            <span style="font-weight:700;margin-right:5px;" class="iconfont">&#xe662;</span>刷新
          </el-button>
        </div>
      </div>
    </div>
    <div class="component-listHeader">
      <div class="search-header">
        <div class="left-title">
          <p class="left-text">
            <span class="iconfont">&#xe61e;</span>
            待收款合同
          </p>
          <div class="right">
            <!-- <button  @click="add">添加</button> -->
          </div>
        </div>
      </div>
    </div>

    <div class="table">
      <el-table ref="multipleTable" :data="info" tooltip-effect="dark" style border>
        <el-table-column label="时间" align="center" width="150" prop="createDate">
          <template slot-scope="scope">{{scope.row.time | timeFilter}}</template>
        </el-table-column>
        <el-table-column label="合同编号" align="center" width="110" prop="outno"></el-table-column>
        <el-table-column label="合同内部编号" align="center" width="150" prop="innerno"></el-table-column>
        <el-table-column label="合同名称" align="center" width="150" prop="name"></el-table-column>
        <el-table-column label="合同金额" align="center" width="150" prop="money"></el-table-column>
        <el-table-column label="收款明细" align="center" width="150" prop="payType">
          <template slot-scope="scope">
            <div v-if="scope.row.payType==1">预付款</div>
            <div v-if="scope.row.payType==2">进度款</div>
            <div v-if="scope.row.payType==3">初验款</div>
            <div v-if="scope.row.payType==4">终验款</div>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <a @click.prevent="detail(scope.$index, scope.row)">查看详情</a>
            <!--v-show="ms_roleName == 'ProjectManager'"-->
            <a @click.prevent="check(scope.row)">开票请款</a>
            <a @click.prevent="dataList(scope.row.payType)">所需资料</a>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 分页 -->
   <!-- <div class="component-paging"  v-if="info.length > 0">
      <div class="table-bottom">
        <div class="bottom-left"></div>
        <div class="paging">
          <div class="paging-left">
            <p>
              共
              <span>{{Math.ceil(total/pageSize)}}</span> 页/
              <span>{{total}}</span> 条数据
            </p>
          </div>
          <el-pagination
            background
            @size-change="SizeChange($event,dataInit,currentPage,pageSize)"
            @current-change="CurrentChange($event,dataInit,currentPage,pageSize)"
            :current-page="currentPage"
            :page-sizes="[10, 20, 30]"
            :page-size="pageSize"
            layout="sizes, prev, pager, next, jumper"
            :total="total"
          ></el-pagination>
        </div>
      </div>
    </div>-->

    <!--开票弹框-->


   <!--开票弹框-->
    <div class="component-model">
      <div class="lpper">
        <el-dialog title="开票请款" :visible.sync="ticket" width="950px" :before-close="handleBeforeClose">
          <div class="ticket_top">
            <div style="text-align:left;font-size:16px;">付款方信息：</div>
            <el-form
              :model="paySide"
              ref="paySide"
              :rules="rules"
              label-width="350px"
              style="width:600px;margin:20px auto;"
            >
              <el-form-item label="认证单位名称（一般纳税人税务登记证上的名称）：" prop="name" style="margin-bottom: 20px;">
                <el-select
                  v-model="paySide.name"
                  placeholder="请选择"
                  clearable
                  style="width:240px"
                  @change="changes"
                >
                  <el-option
                    v-for="(item, index) in list3"
                    :key="index"
                    :value="item.orgId"
                    :label="item.orgName"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="国税一般纳税人识别号（新：统一社会信用代码）：" prop="code" style="margin-bottom: 20px;">
                <el-input v-model="paySide.code" style="width:240px;"></el-input>
              </el-form-item>
              <el-form-item label="地址：" prop="addr" style="margin-bottom: 20px;">
                <el-input v-model="paySide.addr" style="width:240px;"></el-input>
              </el-form-item>
              <el-form-item label="电话：" prop="tel" style="margin-bottom: 20px;">
                <el-input v-model="paySide.tel" style="width:240px;"></el-input>
              </el-form-item>
              <el-form-item label="开户行：" prop="open" style="margin-bottom: 20px;">
                <el-input v-model="paySide.open" style="width:240px;"></el-input>
              </el-form-item>
              <el-form-item label="账号：" prop="accountNo" style="margin-bottom: 20px;">
                <el-input v-model="paySide.accountNo" style="width:240px;"></el-input>
              </el-form-item>
              <el-form-item label="发票类型：" prop="InvType" style="margin-bottom: 20px;">
                <el-select
                  v-model="paySide.InvType"
                  placeholder="请选择"
                  clearable
                  style="width:240px"
                  @change="changes"
                >
                  <el-option
                    v-for="(item, index) in InvTypes"
                    :key="index"
                    :value="item.id"
                    :label="item.name"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="备注：" prop="remark" style="margin-bottom: 20px;">
                <el-input v-model="paySide.remark" style="width:240px;"></el-input>
              </el-form-item>
              <div style="margin-left: -154px;">
                <div class="component-listHeader">
                  <div class="search-header">
                    <div class="left-title">
                      <p class="left-text">
                        <span class="iconfont">&#xe61e;</span>
                        开票信息
                      </p>
                      <div class="right">
                        <button @click.prevent="ticketAddInfo={};invMoney=0;ticketAdd=true">添加信息</button>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="table" style="width:900px;">
                  <el-table ref="multipleTable" :data="ticketInfo" tooltip-effect="dark" style border>
                    <el-table-column label="服务名称" align="center" width="120" prop="serviceName"></el-table-column>
                    <el-table-column label="计量单位" align="center" width="120" prop="unit"></el-table-column>
                    <el-table-column label="规格型号" align="center" width="120" prop="model"></el-table-column>
                    <el-table-column label="数量" align="center" width="120" prop="num"></el-table-column>
                    <el-table-column label="单价" align="center" width="120" prop="price"></el-table-column>
                    <el-table-column label="金额(万元)" align="center" width="120" prop="money"></el-table-column>
                    <el-table-column label="税率" align="center" prop="taxRate"></el-table-column>
                    <el-table-column label="操作" align="center">
                      <template slot-scope="scope">
                        <a @click="handleCheckDelete(scope.row,scope.$index)" type="text" size="small" class="red">删除</a>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
              <el-form-item style="margin-top: 20px;">
                <a style="padding: 10px 20px;border:1px solid #ccc;border-radius: 4px;" @click="resetForm('paySide')">取消</a>
                <a style="padding: 10px 20px;background: #1abc9c;border-radius: 4px;" @click="submitForm('paySide')">确定</a>
              </el-form-item>
            </el-form>
          </div>
        </el-dialog>
      </div>
    </div>
    <!--<div class="component-model">
      <div class="lpper">
      <el-dialog title="开票请款" :visible.sync="ticket" width="950px">
        <div class="ticket_top">
          <div style="text-align:left;font-size:16px;">付款方信息：</div>
          <el-form
            :model="paySide"
            ref="ruleForm"
            label-width="350px"
            style="width:600px;margin:20px auto;"
          >
            <el-form-item label="认证单位名称（一般纳税人税务登记证上的名称）：" prop="name">
               <el-select v-model="paySide.name" placeholder="请选择" clearable style="width:240px"     @change="changes">
                <el-option
                  v-for="(item, index) in list3"
                  :key="index"
                  :value="item.orgId"
                  :label="item.orgName"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="国税一般纳税人识别号（新：统一社会信用代码）：" prop="code">
              <el-input v-model="paySide.code" style="width:240px;"></el-input>
            </el-form-item>
            <el-form-item label="地址：" prop="addr">
              <el-input v-model="paySide.addr" style="width:240px;"></el-input>
            </el-form-item>
            <el-form-item label="电话：" prop="tel">
              <el-input v-model="paySide.tel" style="width:240px;"></el-input>
            </el-form-item>
            <el-form-item label="开户行：" prop="open">
              <el-input v-model="paySide.open" style="width:240px;"></el-input>
            </el-form-item>
            <el-form-item label="账号：" prop="accountNo">
              <el-input v-model="paySide.accountNo" style="width:240px;"></el-input>
            </el-form-item>
            <el-form-item label="备注：" prop="remark">
              <el-input v-model="paySide.remark" style="width:240px;"></el-input>
            </el-form-item>
          </el-form>
        </div>
        <div class="ticket_bottom">
          <div class="component-listHeader">
            <div class="search-header">
              <div class="left-title">
                <p class="left-text">
                  <span class="iconfont">&#xe61e;</span>开票信息
                </p>
                <div class="right">
                  <button @click="ticketAdd=true;ticketAddInfo={};">添加信息</button>
                </div>
              </div>
            </div>
          </div>

          <div class="table" style="width:900px;">
            <el-table ref="multipleTable" :data="ticketInfo" tooltip-effect="dark" style border>
              <el-table-column label="服务名称" align="center" width="120" prop="serviceName"></el-table-column>
              <el-table-column label="计量单位" align="center" width="120" prop="unit"></el-table-column>
              <el-table-column label="规格型号" align="center" width="120" prop="model"></el-table-column>
              <el-table-column label="数量" align="center" width="120" prop="num"></el-table-column>
              <el-table-column label="单价" align="center" width="120" prop="price"></el-table-column>
              <el-table-column label="金额(万元)" align="center" width="120" prop="money"></el-table-column>
              <el-table-column label="税率" align="center" prop="taxRate"></el-table-column>
            </el-table>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="ticket = false">取消</el-button>
          <el-button @click="ticket = true;kticket()">确定</el-button>
        </span>
      </el-dialog>
      </div>
    </div>-->

    <!--添加信息弹框-->
    <div class="component-model">
      <el-dialog title="添加信息" :visible.sync="ticketAdd" width="500px">
        <div class="ticket_top">
          <el-form
            :model="ticketAddInfo"
            ref="ruleForms"
            label-width="100px"
            style="width:350px;margin:20px auto;"
          >


            <el-form-item label="服务名称" prop="serviceName">
              <el-input v-model="ticketAddInfo.serviceName" style="width:240px;"></el-input>
            </el-form-item>


         <el-form-item label="计量单位" prop="unit">
              <el-input v-model="ticketAddInfo.unit" style="width:240px;"></el-input>
            </el-form-item>


             <el-form-item label="规格型号" prop="model">
              <el-input v-model="ticketAddInfo.model" style="width:240px;"></el-input>
            </el-form-item>



          <el-form-item label="数量" prop="num">
              <el-input type="number" v-model="ticketAddInfo.num" style="width:240px;"></el-input>
            </el-form-item>


             <el-form-item label="单价(万元)" prop="price">
              <el-input type="number" v-model="ticketAddInfo.price" style="width:240px;"></el-input>
            </el-form-item>


             <el-form-item label="金额(万元)" prop="money">
               <div v-if="isNaN(ticketAddInfo.num) || isNaN(ticketAddInfo.price)" style="width:240px;"></div>
               <el-input v-else v-model="ticketAddInfo.money = ticketAddInfo.num * ticketAddInfo.price" disabled style="width:240px;"></el-input>
            </el-form-item>


             <!-- <el-form-item label="备注" prop="userName7">
              <el-input v-model="ticketAddInfo.userName7" style="width:240px;"></el-input>
            </el-form-item>

             <el-form-item label="发票种类" prop="userName8">
              <el-input v-model="ticketAddInfo.userName8" style="width:240px;"></el-input>
            </el-form-item> -->


           <el-form-item label="税率" prop="taxRate">
              <el-input v-model="ticketAddInfo.taxRate" style="width:240px;"></el-input>
            </el-form-item>


          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="ticketAdd = false">重置</el-button>
          <el-button @click="submitForm1('ruleForms')">添加</el-button>
        </span>
      </el-dialog>
    </div>

    <!--所需资料弹框-->
    <div class="component-model" style="width: 1100px;">
      <el-dialog title="需要资料(只能上传jpg/png文件，且不超过10MB)" :visible.sync="dataListShow" width="1000px">
        <div class="dataList" style="display: flex;flex-wrap: wrap;">
          <div v-for="(item,index) in dataLists" :key="index" style="display: flex;flex-wrap: wrap;">
              <span style="display: inline-block;width: 300px;">{{item.constName}}</span>
              <el-checkbox v-show="item.isUpload == 1" v-model="checked"></el-checkbox>
              <el-upload
                v-show="item.isUpload == 0"
                class="upload-demo"
                action="/api/web/sysFile/uploadFile"
                :headers="myheader"
                :data="{'parentId':item.constId,'bizType':'contract'}"
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :on-success="successFile"
                :before-remove="beforeRemove"
                :show-file-list="false"
                multiple
                :limit="1"
                accept=".jpg,.png,.JPG,.PNG"
                :before-upload="beforeAvatarUpload"
                :on-exceed="handleExceed"
                :file-list="fileList">
                <el-button size="small" type="primary">上传文件</el-button>
              </el-upload>
          </div>
        </div>
      </el-dialog>
    </div>

  </div>
</template>

<script>
export default {
  data() {
    return {
      ms_roleName: localStorage.getItem("roleName"),
      myheader:{token:localStorage.getItem("token")},
      exe_data:{'parentId':this.$route.params.inId,'bizType':'contract'},
      conId:'',//合同id
      fileList: [],
      ticketAdd: false, //添加弹窗的bool值
      // 虚拟合同id

      moneyDetail:false,
      falseId: "",
      falsenum: 0,
      subnum: 0,
      form: {
        //合同信息-单项合同信息
        parentid:"",
      },
      flag: true, //是否可编辑
      activeName: "first",
      info: [],
      multipleSelection: [], //全选
      lists: "",
      details: [
        {
          //开票明细
          num: "45662",
          name: "上海通信工程",
          pay: "456",
          money: "4566"
        }
      ],
      arrive: [],
      dialogVisible: false, //导出弹框是否显示
      options: [],
      value: "", //导出
      total: 0,
      // 每页显示数据的条数
      pageSize: 10,
      // 当前显示的页面页码
      currentPage: 1,
      // 开票明细
      // list1: [],
      ticketAddInfo: {}, //添加弹窗的表单
      obj: {},
      // 到账汇总
      obj3: {},
      aa: 0,
      bb: 0,
      cc: 0,
      dd: 0, //进度条百分比，后期根据后端数据在更改，现在展示用
      deObj: [],
      ticket: false, //开票请款弹框
      paySide: {
        name: "",
        code: "",
        addr: "",
        open: "",
        tel: "",
        accountNo: "",
        InvType:''
      }, //开票弹窗的表单 - 付款人信息
      ticketInfo: [], //开票弹窗的table
      ticketAdd: false, //添加弹窗的bool值
      InvTypes:[{name:'电子发票',id:'51'},{name:'增值税发票',id:'0'},{name:'普通发票',id:'2'}],
      rules:{
        InvType: [
          { required: true, message: '请选择发票类型', trigger: 'change' },
        ],
        name: [
          { required: true, message: '请选择认证单位名称', trigger: 'change' }
        ],
        code: [
          { required: true, message: '请输入纳锐人识别号', trigger: 'blur' },
          { min: 1, max: 50, message: '长度在 1 到 50 个字符', trigger: 'blur' }
        ],
        addr: [
          { required: true, message: '请输入地址', trigger: 'blur' },
          { min: 1, max: 200, message: '长度在 1 到 200 个字符', trigger: 'blur' }
        ],
        tel: [
          { required: true, message: '请输入电话', trigger: 'blur' },
          { min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' }
        ],
        open: [
          { required: true, message: '请输入开户行', trigger: 'blur' },
          { min: 1, max: 100, message: '长度在 1 到 100 个字符', trigger: 'blur' }
        ],
        accountNo: [
          { required: true, message: '请输入账号', trigger: 'blur' },
          { min: 1, max: 30, message: '长度在 1 到 30 个字符', trigger: 'blur' }
        ],
        remark: [
          { message: '请输入备注', trigger: 'blur' },
          { min: 1, max: 500, message: '长度在 1 到 500 个字符', trigger: 'blur' }
        ],
        serviceName: [
          { message: '请输入服务名称', trigger: 'blur' },
          { min: 1, max: 32, message: '长度在 1 到 32 个字符', trigger: 'blur' }
        ],
        unit: [
          { message: '请输入计量单位', trigger: 'blur' },
          { min: 1, max: 32, message: '长度在 1 到 32 个字符', trigger: 'blur' }
        ],
        model: [
          { message: '请输入规则型号', trigger: 'blur' },
          { min: 1, max: 32, message: '长度在 1 到 32 个字符', trigger: 'blur' }
        ],
        num: [
          { message: '请输入数量', trigger: 'blur' }
        ],
        price: [
          { message: '请输入单价', trigger: 'blur' }
        ],
        money: [
          { message: '请输入金额', trigger: 'blur' }
        ],
        taxRate: [
          { message: '请输入税率', trigger: 'blur' }
        ],
      },
      types:"",
      list1:[],
      list2:[],

      openSource:"",
      list3:[],
      newArray: {},
      dataListShow:false,
      checked:true,
      dataLists:[],//所需资料列表
      ispayType:'',//所需资料类型
      invMoney:0,
    };
  },
  created() {
    this.searchInfo();
    // this.conPay();

    this.getRenzheng()
    //
  },
  mounted() {
    this.dataInit();
  },
  methods: {
    //关闭之前清除表单
    handleBeforeClose(){
      this.$refs['paySide'].resetFields();
      this.ticket = false;
    },
    //删除一行
    handleCheckDelete(val,index){
      this.ticketInfo.splice(index,1);
    },
    //计算总金额
    totalMoneys(){
      let that = this;
      that.ticketInfo.forEach(function(value, index, array) {
        that.invMoney += parseFloat(value.money)
      });
      return that.invMoney
    },
    //点击取消开票请款
    resetForm(formName) {
      this.ticket = false;
      this.$refs[formName].resetFields();
    },
    //点击确定开票请款
    submitForm(formName){
      let that = this;
      that.$refs[formName].validate((valid) => {
        if (valid) {
          if(this.ticketInfo.length>0){
            this.kticket();
            this.ticket = false;
          }else{
            this.$erMsg("请填写开票信息")
          }
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    submitForm1(formName){
      if(this.ticketAddInfo.serviceName && this.ticketAddInfo.unit && this.ticketAddInfo.model && this.ticketAddInfo.num && this.ticketAddInfo.price && this.ticketAddInfo.money && this.ticketAddInfo.taxRate){
        this.addInfos();
        this.ticketAdd = false;
      }else{
        this.$erMsg("填写信息有空值")
      }
    },
/*    revers() {
      // 重置清空表单
      this.ticketAddInfo.userName = "";
      this.ticketAddInfo.userTruename = "";
      this.ticketAddInfo.orgName = "";
      this.ticketAddInfo.roleNames = "";
      this.ticketAddInfo.orgsingle = "";
      this.ticketAddInfo.orgMoney = "";
      this.ticketAddInfo.persent = "";
    },*/

    addInfos() {
      //  this.ticketAddInfo = this.ticketInfo
      console.log(this.ticketAddInfo);

//      this.ticketInfo.push(this.ticketAddInfo);
//      this.ticketAddInfo = [];
      this.ticketInfo.push(this.deepClone(this.ticketAddInfo));

      console.log(this.ticketInfo);
    },
    // 点击所需资料
    dataList(val){
      let code="";
      if(val == 1 || this.ispayType == 'ContractRemindDoc_1'){
        code = 'ContractRemindDoc_1'
      }else if(val == 2 || this.ispayType == 'ContractRemindDoc_2'){
        code = 'ContractRemindDoc_2'
      }else if(val == 3 || this.ispayType == 'ContractRemindDoc_3'){
        code = 'ContractRemindDoc_3'
      }else{
        code = 'ContractRemindDoc_4'
      }
      this.ispayType = code;
      console.log(this.ispayType)
      let params ={
        docTypeCode:code
      };
      let suCb = res => {
        this.dataListShow = true;
        this.dataLists = res.data.data;
        console.log("所需资料：",res.data.data);
      };
      let erCb = res => {
        console.log(res);
      };
      let req = {
        url: "/api/web/proContract/getDocName",
        methods: "post",
        data: params,
        success: suCb,
        error: erCb
      };
      this.$https(req);
    },
    // 获取认证类型
      getRenzheng(){
      let that = this;
      let params ={outType:'0'};
      let suCb = res => {
        console.log(res,"认证信息");
        that.list3=res.data.data

      };
      let erCb = res => {
        console.log(res);
      };
      let req = {
        url: "/api/web/sysOrg/getOrgNamebyType",
        methods: "post",
        data: params,
        success: suCb,
        error: erCb
      };
      that.$https(req);
    },
  // 调用开票请款确定按钮
      kticket(){
        let that = this;
        let params = {
          // orgName: that.paySide.name,
          orgId :that.paySide.name,// 组织机构id
          orgName:that.newArray.orgName,//机构名称
          invTaxno: that.paySide.code,//纳税人识别号
          address: that.paySide.addr,//地址
          tele: that.paySide.tel,//电话
          bankName: that.paySide.open,//开户行
          accountNo: that.paySide.accountNo,//账户
          conId: that.conId,  // 合同id
          invMoney: that.totalMoneys()+"", // 开票金额
          openSource: that.openSource+"",
          invoice: that.ticketInfo,
          InvType:that.paySide.InvType,

      };
      let suCb = res => {
        this.ticket = false;
        this.dataInit();
        console.log(res);
      };
      let erCb = res => {
        console.log(res);
      };
      let req = {
        url: "/api/web/proInvoice/toInvoicePay",
        methods: "post",
        data: params,
        success: suCb,
        error: erCb
      };
      that.$https(req);
      },

    //文件上传
    handleRemove(file, fileList) {
      if(file.status == "success") {
        let that = this;
        let suCb = function(res){
          that.fileList = []
        }
        let erCb = function(res){
          console.log(res)
        }
        let postData = {
          parentId:that.$route.params.inId,
          fileUrl:that.delFile
        }
        let palyParam = {
          url: "/api/web/sysFile/deleteFile",
          methods:'post',
          data: postData,
          success: suCb,
          error: erCb,
        }
        that.$https(palyParam)
      }else{
        this.fileList = []
      }
    },
    handlePreview(file) {
      console.log(222)
      console.log(file);
    },
    handleExceed(files, fileList) {
      console.log(333)
      return true;
//      this.$message.warning(`当前限制选择 1 个文件，请先删除再上传`);
    },
    beforeRemove(file, fileList) {
      console.log(444)
//      return this.$confirm('确认删除吗？');
    },
    beforeAvatarUpload(file) {
      const isLt2M = file.size / 1024 / 1024 < 10;
      if (!isLt2M) {
        this.$message.error('上传图片大小不能超过 10MB!');
      }
      return isLt2M;
    },
    successFile(response, file, fileList){
      console.log(666)
      this.delFile = file.response.fileUrl;
      this.fileList = fileList;
      this.dataList(this.ispayType);
    },
    // 默认第一页
    searchInfo() {
      this.currentPage = 1;
      this.dataInit();
    },
    // 获取合同列表
    dataInit() {
      let that = this;
      let suCb = res => {
        console.log(res.data.data);
        that.info = res.data.data;
      };
      let erCb = res => {
      };
      let params = {
         /* pageCurrent:that.currentPage+"",
          pageSize:that.pageSize+""*/
      };
      let req = {
        url: "/api/web/proContract/getWaitPaymentContract",
        methods: "post",
        data: params,
        success: suCb,
        error: erCb
      };
      that.$https(req);
    },
    // 查看详情  合同
    detail(index, row) {
      this.$router.push({
        name: "detailsingle",
        query: {
          row: row.conId,
          rows:row.parentId,
          conType:'3',
          flg: this.flg,
          activeTab:'third'
        }
      })
      /*let that = this;
      let suCb = res => {
        this.$router.push({
          name: "detailsingle",
          query: {
              row: row.conId,
              rows:row.parentId,
              flg: that.flg,
          }
        })
      };
      let erCb = res => {
       console.log(33);
       };
      let params = {
        conId: row.conId
      };
      let req = {
        url: "/api/web/proContract/getProInvoiceCollection",
        methods: "post",
        data: params,
        success: suCb,
        error: erCb
      };
      that.$https(req);*/
    },
    // 开票请款
    changes(){
       this.newArray = this.list3.find(item => {
        if (item.orgId === this.paySide.name) {
          return item;
        }
      });
      console.log(this.newArray);
    },
    check(val) {
        console.log(val)
      this.ticket = true;
      this.openSource = val.payType;
      this.conId = val.conId;
      this.ticketInfo = [];
      this.paySide.name="";
      this.paySide.code="";
      this.paySide.addr="";
      this.paySide.open="";
      this.paySide.tel="";
      this.paySide.accountNo="";
//      this.paySide.remark = "";
      this.paySide.InvType = "";

      this.ticketAddInfo.serviceName="";
      this.ticketAddInfo.unit="";
      this.ticketAddInfo.model="";
      this.ticketAddInfo.num="";
      this.ticketAddInfo.price="";
      this.ticketAddInfo.money="";
      this.ticketAddInfo.taxRate="";
    }
  },
  watch: {}
};
</script>
<style scoped>
.component-listHeader .search-header {
  width: 1100px;
  box-sizing: border-box;
  border: 1px solid rgba(228, 228, 228, 1);
  background-color: rgba(255, 255, 255, 1);
  margin: 20px auto 0;
  border-bottom: 0;
}

.component-listHeader .search-header .left-title {
  display: flex;
  justify-content: space-between;
  width: 100%;
  background-color: rgba(243, 243, 243, 1);
  height: 45px;
  box-sizing: border-box;
}

.component-listHeader .search-header .left-title .left-text {
  width: 20%;
  color: #666;
  font-family: "微软雅黑";
  font-weight: 400;
  font-size: 12px;
  line-height: 45px;
  text-align: left;
  margin: 0 0 0 30px;
}

.component-listHeader .search-header .right {
  width: 70%;
  display: flex;
  justify-content: flex-end;
  margin-right: 10px;
}

.component-listHeader .search-header .right button {
  padding: 0 15px;
  height: 30px;
  width: 80px;
  margin: 6px 5px;
  line-height: 30px;
  font-size: 14px;
  color: #666;
  background-color: #fff;
  border: 1px solid #ccc;
}

.component-listHeader .search-header .right button:hover {
  background-color: #f3f3f3;
}

.component-listHeader .search-header .right .right-select-margin {
  margin-top: 6px;
  margin-right: 8px;
}

.table {
  width: 1100px;
  margin: 0 auto;
}

.el-table .cell a {
  color: #1abc9a;
  text-decoration: none;
  cursor: pointer;
  margin-left: 5px;
}

.pro_gourp {
  display: flex;
  justify-content: space-around;
  flex-wrap: nowrap;
  flex-direction: column;
}
.pro_gourp li {
  display: flex;
  justify-content: space-around;
  flex-wrap: nowrap;
  line-height: 35px;
  height: 35px;
  box-sizing: border-box;
  position: relative;
  margin-bottom: 20px;
}
.pro_gourp li .tips {
  position: absolute;
  top: 30px;
  left: 100px;
}

.pro_gourp li .tips .tips_arrow {
  width: 0;
  height: 0;
  border-width: 0 5px 7px;
  border-style: solid;
  border-color: transparent transparent #1abc9c;
  margin: 0 auto;
}

.pro_gourp li .tips .tips_text {
  font-size: 12px;
  color: #606266;
  line-height: 16px;
  width: 200px;
  text-align: center;
}

.pro_gourp li .totalPro {
  width: 50px;
  font-size: 14px;
  color: #606266;
  text-align: right;
}

.pro_gourp li button {
  white-space: nowrap;
  cursor: pointer;
  background: #fff;
  border: 1px solid #dcdfe6;
  color: #606266;
  text-align: center;
  box-sizing: border-box;
  outline: 0;
  margin: 0;
  transition: 0.1s;
  font-weight: 500;
  padding: 6.5px 20px;
  font-size: 14px;
  border-radius: 4px;
  margin-left: 20px;
}

.pro_gourp li button:hover {
  background: #1abc9c;
  border: 1px solid #1abc9c;
  color: #fff;
}

.component-model .component-listHeader .search-header {
  width: 900px;
  box-sizing: border-box;
  border: 1px solid rgba(228, 228, 228, 1);
  background-color: rgba(255, 255, 255, 1);
  margin: 20px auto 0;
  border-bottom: 0;
}

.component-model .component-listHeader .search-header .left-title {
  display: flex;
  justify-content: space-between;
  width: 100%;
  background-color: rgba(243, 243, 243, 1);
  height: 45px;
  box-sizing: border-box;
}

.component-model .component-listHeader .search-header .left-title .left-text {
  width: 20%;
  color: #666;
  font-family: "微软雅黑";
  font-weight: 400;
  font-size: 12px;
  line-height: 45px;
  text-align: left;
  margin: 0 0 0 30px;
}

.component-model .component-listHeader .search-header .right {
  width: 70%;
  display: flex;
  justify-content: flex-end;
  margin-right: 10px;
}

.component-model .component-listHeader .search-header .right button {
  padding: 0 15px;
  height: 30px;
  width: 100px;
  margin: 6px 5px;
  line-height: 30px;
  font-size: 14px;
  color: #666;
  background-color: #fff;
  border: 1px solid #ccc;
}

.component-model .component-listHeader .search-header .right button:hover {
  background-color: #f3f3f3;
}

.component-model
  .component-listHeader
  .search-header
  .right
  .right-select-margin {
  margin-top: 6px;
  margin-right: 8px;
}

.component-model .table {
  width: 100%;
  margin: 0 auto;
}

/* 开票详情 */
.fl-container {
  display: flex;
  justify-content: space-around;
  align-items: baseline;
  margin: 5px 0;
}
.fl-container .left {
  width: 140px;
  text-align: right;
}
.fl-container .right {
  width: 300px;
  text-align: left;
  word-wrap: break-word;
}
  .dataList{
    display: flex;
  }
  .dataList>div{
    width: 50%;
    height: 40px;
    line-height: 40px;
  }
</style>
